import React, { Component } from 'react';
import CommentHeader from './header/Header';
import CommentList from './list/List';
import '../../../css.css'
class CommentIndex extends Component {
  state = { 
    list: [
      {
        title: '评论人：jack',
        content: '评论内容： 沙发！！！'
    }
    ]
  } 
  // 把list的数据push到msg中
  updateList = (msg)=>{
      // 第一中方法
      // const list = this.state.list.concat([msg])
      // 第二中方法
      const list = [...this.state.list]
      list.push(msg)
       this.setState({
          list
       })
  }
// 清空
delArr = ()=>{
  this.state.list.length=0
  this.setState({
    list:this.state.list
  })
}
  render() { 
    return ( <>
    <h3>7.2.1 评论案例</h3>
      <div className='comment'>
        <div className='comment_content'>
        <CommentHeader delArr={this.delArr} list={this.state.list} updateList={this.updateList}/>
        <CommentList list={this.state.list}/>
        </div>
      </div>
    </> );
  }
}
 
export default CommentIndex;